<template>
<div>
     <div class="box1">
    <h6>10月20日 周三</h6>
    <div class="hengxian"></div>
    <div class="demo">
      <div class="ceshi">测试</div>
      <div class="time">11.00</div>
      <div class="img">
        <img src="/soon/3.jpg" alt="" />
      </div>
      <div class="text">
        <div class="text-1">
          <h2>悠久之术</h2>
          <p>土木朋克风的像素奇幻冒险！与玄奘一起踏上西行之路！</p>
        </div>
        <div class="text-2">
           <button>预约</button></div>
      </div>
    </div>
  </div>
</div>
 
</template>

<script>
export default {};
</script>

<style scoped>
.box1 {
  width: 100%;
  padding: 0, 0.16rem;
}
.box1 h6 {
  font-size: 0.16rem;
  color: #1d2127;
  padding: 0.06rem 0.16rem;
  height: 100%;
}
.hengxian {
  width: 2.2296rem;
  height: 0.01rem;
  margin-left: 1.3rem;
  margin-top: -0.15rem;
  background-color: #ebebec;
}
.demo {
  margin-top: 0.2rem;
  margin-left: 0.2rem;
  position: relative;
}
.ceshi {
  width: 0.24rem;
  font-size: 0.12rem;
  color: #15c5ce;
  background-color: #ecfafb;
  padding-left: 0.08rem;
  padding-right: 0.12rem;
  border-radius: 0 0.6rem 0 0;
}
.demo .time {
  /* display: inline-block; */
  color: #b9bec1;
  /* background-color: red; */
  font-size: 0.1rem;
  position: absolute;
  top: 0.02rem;
  left: 0.5rem;
}
.img img {
  width: 3.432rem;
  height: 1.9305rem;
  border-radius: 0.03rem;
}
.text {
  width: 3.432rem;
  height: 0.722rem;
  /* background-color: pink; */
  display: flex;
  justify-content:space-around;
  margin-top: -0.1rem;
}
.text-1{
    width: 2.732rem;
    height: 0.632rem;
    /* background-color: red; */
}
.text-1 h2{
    color: #1D2127;
    font-size:0.16rem ;
}
.text-1 p{
    width: 2.632rem;
    color: #868C92;
    font-size:0.12rem ;
}
.text-2{
    width: 0.7rem;
    height: 0.632rem;
    /* background-color:purple; */
    position: relative;
    /* font-size: 0.16rem; */
}
.text-2 button{
    width: 0.7rem;
    height: 0.28rem;
    background-color: #BCFAFB;
    color: #15C5CE;
    position:absolute;
    top: 0;
    border-radius: 0.4rem;
    border: none;
}
</style>